// 引入react
import * as React from 'react';
import {StyleSheet, View, Alert, Text, ScrollView, TouchableOpacity} from 'react-native';
import AllStyle from '../../../../../style';
import {HeaderTitle} from '../../../../../componet/settingComponent/HeaderTitle';
import {CardItem} from '../../../../../componet/settingComponent/CardItem';
import {BottomButton} from '../../../../../componet/settingComponent/BottomButton';
import {SafeAreaView} from 'react-native-safe-area-context';
import {Toast} from '../../../../../utils/Toast';
import {
    getEmpPlanClassesEntityById,
    removeEmpPlanClassesById,
    saveEmpPlanClasses,
} from '../../../../../api/empPlanClasses';
import {Loading} from '../../../../../utils/Loading';

/**
 * @Description:
 * @author TangYong
 * @date 2022/12/19
 */
export class SaveSignPlanGroup extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            headerTitle: this.props.route.params.title,
            empPlanClasses: {
                empPlanClassesId: this.props.route.params.empPlanClassesId != null ? this.props.route.params.empPlanClassesId : null,
                planName: null,
                period: {
                    periodId: null,
                    periodStartTime: null,
                    periodEndTime: null,
                    periodStatus: 0,
                    notSignList: [],
                    tureSignList: [],
                },
                userId: null,
                classesId: null,
                userIds: [],
                signPlaceIds: [],
                isEffect: 0,
            },
        };
    }

    //生命周期：组件挂载后
    componentDidMount() {
        if (this.state.empPlanClasses.empPlanClassesId != null) {
            this.getInfo(this.state.empPlanClasses.empPlanClassesId);

        }

    }

    getInfo(id) {
        Loading.show();
        getEmpPlanClassesEntityById(id).then(res => {
            let empPlanClasses = this.state.empPlanClasses;
            empPlanClasses = res.empPlanClasses;
            this.setState({empPlanClasses});
            console.log('res-------------------------', res);
            Loading.hidden();
        }).catch(err => {
            Loading.hidden();
            Toast.showWarning(err.toString());
        }).finally(()=>{
            Loading.hidden();
        });
    }

// {
//     title:"保存考勤方案组",
//     period:period,
//     classesId:this.state.classesId
// }
    componentDidUpdate(prevProps: Readonly<P>, prevState: Readonly<S>, snapshot: SS) {

        if (this.props.route.params != prevProps.route.params) {

            let empPlanClasses = this.state.empPlanClasses;
            let userIds = this.props.route.params.userIds;
            if (userIds) {
                empPlanClasses.userIds = userIds;
                this.setState({empPlanClasses});
            }
            let propsPlanName = this.props.route.params.Name;

            if (propsPlanName) {
                empPlanClasses.planName = propsPlanName;
                this.setState({empPlanClasses});
            }

            let propsPeriod = this.props.route.params.period;
            let propsClassesId = this.props.route.params.classesId;
            //console.log(this.props.route.params.Name, propsPeriod, propsClassesId);
            if (propsClassesId) {
                //待完善
                empPlanClasses.classesId = propsClassesId;
                this.setState({empPlanClasses});
            }
            if (propsPeriod) {
                //console.log(propsPeriod)
                empPlanClasses.period = propsPeriod;
                this.setState({empPlanClasses});
            }
            let signPlaceIds = this.props.route.params.signPlaceIds;
            if (signPlaceIds) {
                empPlanClasses.signPlaceIds = signPlaceIds;
                this.setState({empPlanClasses});
            }
            //console.log()

        }
    }

    //方法
    back = () => {


        let route = {
            name: 'SignPlanGroup',
            params: {
                title: '考勤方案组',
            },
        };
        this.props.navigation.navigate(route);
    };
    goto = (name, params) => {

        const route = {
            name: name,
            params: {
                routePathName: this.props.route.name,
                ...params,
            },

        };
        this.props.navigation.navigate(route);
    };

    save() {
        let empPlanClasses = this.state.empPlanClasses;

        if (empPlanClasses.userIds.length <= 0) {
            Toast.showWarning('请选择考勤人员');
            return;
        }
        if (empPlanClasses.planName == null || empPlanClasses.planName == '') {
            Toast.showWarning('考勤名称不能为空');
            return;
        }
        if (empPlanClasses.period.periodStartTime == null) {
            Toast.showWarning('请选择考勤日期');
            return;
        }
        if (empPlanClasses.classesId == null) {
            Toast.showWarning('请选择打卡班次');
            return;
        }
        if (empPlanClasses.signPlaceIds <= 0) {
            Toast.showWarning('请设置一个打卡地址以上');
            return;
        }
        Alert.alert(
            '温馨提示',
            '你希望考勤规则什么时候生效？',
            [
                {
                    text: '明天生效',
                    onPress: () => {
                        empPlanClasses.isEffect = 0;
                        Loading.show();
                        saveEmpPlanClasses(empPlanClasses).then(res => {
                            Loading.hidden();
                            this.goto('SignPlanGroup', {title: '考勤方案组'});
                        }).catch(err => {
                            Loading.hidden();
                            Toast.showWarning(err.toString());
                        }).finally(()=>{
                            Loading.hidden();
                        });
                    },
                },
                {
                    text: '取消',
                    onPress: () => console.log('Cancel Pressed'),
                    style: 'cancel',
                },
                {
                    text: '立即生效',
                    onPress: () => {
                        empPlanClasses.isEffect = 1;
                        Loading.show();
                        saveEmpPlanClasses(empPlanClasses).then(res => {
                             Loading.hidden();
                            this.goto('SignPlanGroup', {title: '考勤方案组'});
                        }).catch(err => {
                            Loading.hidden();
                            Toast.showWarning(err.toString());
                        }).finally(()=>{
                            Loading.hidden();
                        });
                    },
                },
            ],
        );

        console.log('save', this.state.empPlanClasses.signPlaceIds);
    }
    delete(){
        Alert.alert(
            '温馨提示',
            '删除考勤组会导致所有在考勤组的成员规则失效，请确认后再删除',
            [
                {
                    text: '确认删除',
                    onPress: () => {
                        Loading.show();
                        removeEmpPlanClassesById(this.state.empPlanClasses.empPlanClassesId).then(res=>{
                            Loading.hidden();
                            this.goto('SignPlanGroup', {title: '考勤方案组'});

                        }).catch(err=>{
                            Loading.hidden();
                            Toast.showWarning(err.toString())
                        }).finally(()=>{
                            Loading.hidden();
                        })
                    },
                },
                {
                    text: '取消',
                    onPress: () => console.log('Cancel Pressed'),
                    style: 'cancel',
                },
            ],
        );


    }
    //DOM
    render() {
        return (
            <SafeAreaView edges={['top', 'left', 'right', 'bottom']} style={{flex: 1, backgroundColor: '#FFF'}}>
                <View style={AllStyle.container}>
                    <HeaderTitle goBack={() => {
                        this.back();
                    }} headtitle={this.state.headerTitle}
                    />

                    <ScrollView style={AllStyle.padding15}>
                        <View style={AllStyle.card}>
                            <TouchableOpacity onPress={() => {
                                this.goto('SignEmp', {title: '选择考勤人员', userIds: this.state.empPlanClasses.userIds,empPlanClassesId:this.state.empPlanClasses.empPlanClassesId});
                            }}>
                                <CardItem title='考勤人员'
                                          value={this.state.empPlanClasses.userIds.length > 0 ? '已选择' : '未设置'}></CardItem>
                            </TouchableOpacity>
                            <TouchableOpacity onPress={() => {
                                this.goto('SetName',
                                    {Name: this.state.empPlanClasses.planName, title: '考勤组名称'});
                            }}>
                                <CardItem title='考勤名称'
                                          value={this.state.empPlanClasses.planName == null ? '未设置' : this.state.empPlanClasses.planName}></CardItem>
                            </TouchableOpacity>
                        </View>
                        <View style={AllStyle.card}>
                            <TouchableOpacity onPress={() => {
                                this.goto('SignPeriod',
                                    {
                                        empPlanClassesId: this.state.empPlanClasses.empPlanClassesId,
                                        title: '考勤日期',
                                        period: this.state.empPlanClasses.period,
                                    });
                            }}>
                                <CardItem title='考勤日期'
                                          value={this.state.empPlanClasses.period.periodStartTime == null ? '未设置' : this.state.empPlanClasses.period.periodStartTime.substring(0, 10) + '至' + this.state.empPlanClasses.period.periodEndTime}></CardItem>
                            </TouchableOpacity>
                            <TouchableOpacity onPress={() => this.goto('ClassesManege', {
                                title: '选择班次',
                                visible: true,
                                classesId: this.state.empPlanClasses.classesId,
                            })}>
                                <CardItem title='选择班次'
                                          value={this.state.empPlanClasses.classesId == null ? '未设置' : '已选择'}></CardItem>
                            </TouchableOpacity>
                            <TouchableOpacity onPress={() => {
                                this.goto('signPlace', {
                                    title: '打卡地点',
                                    empPlanClassesId: this.state.empPlanClasses.empPlanClassesId,
                                });
                            }}>
                                <CardItem title='打卡地点'
                                          value={this.state.empPlanClasses.signPlaceIds.length > 0 ? '已设置' : '未设置'}></CardItem>
                            </TouchableOpacity>
                        </View>
                        {
                            this.state.empPlanClasses.empPlanClassesId != null ?
                                (
                                    <TouchableOpacity onPress={() => {
                                        this.delete();
                                    }}>
                                        <View style={AllStyle.card}>
                                            <Text style={style.del}>删除该考勤组</Text>
                                        </View>
                                    </TouchableOpacity>
                                ) : (<View></View>)
                        }


                    </ScrollView>
                    <BottomButton title="保存" click={() => {
                        this.save();
                    }}></BottomButton>
                </View>
            </SafeAreaView>
        );
    }

}

const style = StyleSheet.create({
    //样式
    del: {
        textAlign: 'center',
        // display: 'flex',
        // alignItems: 'center',
        // justifyContent: 'center',
        color: '#fb5f2d',
        fontSize: 16,
        paddingTop: 15,
        paddingBottom: 15,
        paddingRight: 15,

    },
});
